<template>
    <div>
      <div class="header_box">
            <HeaderView>
                <template v-slot:center>
                   <div class="header_box_main">
                    创建团购
                   </div>  
                </template>
            </HeaderView>
        </div>
        <van-cell title="选择单个日期" :value="date" @click="show = true" />
        <van-calendar v-model="show" @confirm="onConfirm" />
    </div>
</template>
<script>
import HeaderView from '@/components/header1View.vue';
export default {
  data() {
    return {
      date: '',
      show: false,
    };
  },
  methods: {
    formatDate(date) {
      return `${date.getMonth() + 1}/${date.getDate()}`;
    },
    onConfirm(date) {
      this.show = false;
      this.date = this.formatDate(date);
    },
  },
  components:{
            HeaderView
  }
};
</script>
<style>
.header_box_main{
        background: #ff6e53;
        width: 100px;
        text-align: center;
        margin:0 auto;
    }
</style>
